<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>测试 JQuery的选择器和事件</title>
		
		<script src="jquery-1.8.3.min.js"></script>
		<script>
			$(function(){   //简写的文档就绪
				//id选择器,选中 id="d1"的元素,并绑定单击事件
				$("#d1").click(function(){    
					//标签名选择器,选中a标签,并隐藏 hide() / show() 
					$("a").hide();   
				});
				//双击h1
				$("#d2").dblclick(function(){
					$("a").show();//显示a标签
				})
			});
			$(function(){ //文档就绪
				// 练习:单击a标签,隐藏所有p标签
				$("a").click(function(){
					$("p").hide();
				});
				//练习:单击h1,给div加背景色css
				$("h1").click(function(){
					$("div").css("background-color","pink");
				});
			});
		</script>
	</head>
	<body>
		<div id="d1">我是div</div>
		<a>我是a</a>
		<span class="m">我是span</span>
		<h1 id="d2">我是h1</h1>
		<p class="m">我是p1</p>
		<p>我是p2</p>
	</body>
</html>
